<template>
  <div id="pubNoticeList">
    <h1 class="con-right-title">
      发布审核
    </h1>
    <!-- 顶部搜索栏 -->
    <top-search :form-inline="formInline" @toSearch="toSearch"></top-search>
    <div class="table-conBtn">
      <freshCom @searchList="searchList"></freshCom>
    </div>

    <!-- 下部table -->
    <el-table
      v-loading="loading"
      :data="tableData"
      style="width: 100%"
      max-height="490"
      ref="table"
    >
      <el-table-column type="index" width="60" label="序号">
        <template slot-scope="scope">
          {{
            scope.$index
              | filterPage(searchParams.pageNum, searchParams.pageSize)
          }}
        </template>
      </el-table-column>
      <el-table-column
        prop="id"
        label="通知编号（ID）"
        width="280"
        align="center"
      ></el-table-column>
      <el-table-column prop="touchType" label="触达通道" width="150">
        <template slot-scope="scope">
          <span
            v-if="scope.row.touchType"
            class="tag-span"
            :class="scope.row.touchType | filterClass('touchType')"
            >{{ scope.row.touchType | filterName('touchType') }}</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="title"
        label="标题"
        :show-overflow-tooltip="true"
        width="200"
        align="center"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.title">{{ scope.row.title }}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="createdDate"
        label="创建时间"
        width="200"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="user.name"
        label="发布者"
        width="200"
        align="center"
      ></el-table-column>
      <el-table-column label="一审状态" width="120">
        <template slot-scope="scope">
          <span
            v-if="scope.row.noticeAuditing.oneAuditing.auditingState === 'PASS'"
            class="tag-span primary"
            >通过</span
          >
          <span
            v-if="
              scope.row.noticeAuditing.oneAuditing.auditingState === 'UNAUDITED'
            "
            class="tag-span warning"
            >未审核</span
          >
          <span
            v-if="scope.row.noticeAuditing.oneAuditing.auditingState === 'FAIL'"
            class="tag-span danger hand"
            @click="noticeMessage(scope.row.noticeAuditing.oneAuditing.remark)"
            >未通过</span
          >
        </template>
      </el-table-column>
      <el-table-column label="二审状态" width="120">
        <template slot-scope="scope">
          <span
            v-if="scope.row.noticeAuditing.twoAuditing.auditingState === 'PASS'"
            class="tag-span primary"
            >通过</span
          >
          <span
            v-if="
              scope.row.noticeAuditing.twoAuditing.auditingState === 'UNAUDITED'
            "
            class="tag-span warning"
            >未审核</span
          >
          <span
            v-if="scope.row.noticeAuditing.twoAuditing.auditingState === 'FAIL'"
            class="tag-span danger hand"
            @click="noticeMessage(scope.row.noticeAuditing.twoAuditing.remark)"
            >未通过</span
          >
        </template>
      </el-table-column>
      <el-table-column label="发布时间" width="170" align="center">
        <template slot-scope="scope">
          <span v-if="scope.row.noticeAuditing.oneAuditing.createdTime">{{
            scope.row.noticeAuditing.oneAuditing.createdTime | timeToTime()
          }}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <template
            v-if="
              scope.row.noticeAuditing.oneAuditing.auditingState === 'UNAUDITED'
            "
          >
            <el-button type="text" @click="auditSuccess(scope.row)">
              审核通过
            </el-button>
            <el-button type="text" @click="auditFail(scope.row.id)">
              不通过
            </el-button>
          </template>
          <template v-permission="'wh:system:publishNotice:edit'">
            <el-button
              v-if="
                scope.row.noticeAuditing.oneAuditing.auditingState === 'PASS' &&
                  scope.row.noticeAuditing.twoAuditing.auditingState === 'FAIL'
              "
              type="text"
              @click="editNotice(scope.row)"
            >
              编辑
            </el-button>
          </template>
          <el-button type="text" @click="openDetail(scope.row.id)">
            查看详情
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-全局组件-->
    <pageCom
      :searchParams="searchParams"
      :total="total"
      @searchList="searchList"
    ></pageCom>
    <!-- 审核不通过对话框 -->
    <audit-fail-dialog
      v-if="auditFailDialogData.isShow"
      :audit-fail-dialog-data="auditFailDialogData"
      from="pubNotice"
      @refresh="refresh"
    ></audit-fail-dialog>
    <!-- 审核通过,编辑对话框 -->
    <audit-success-dialog
      v-if="auditSuccessDialogData.isShow"
      :audit-success-dialog-data="auditSuccessDialogData"
      @refresh="refresh"
    ></audit-success-dialog>
    <!-- 查看详情 dialog -->
    <detailDialog
      v-if="detailDialogData.isShow"
      :dialog-data="detailDialogData"
    ></detailDialog>
    <!-- 身份验证弹窗 -->
    <authentication-dialog
      :auth-dialog-data="authDialogData"
      from="notice"
    ></authentication-dialog>
  </div>
</template>
<script>
import topSearch from '@component/noticeManagement/pubNotice/topSearch'
import auditFailDialog from '@component/noticeManagement/common/auditFailDialog' // 审核不通过
import detailDialog from '@component/noticeManagement/noticeManage/detailDialog' // 查看详情弹窗
import auditSuccessDialog from '@component/noticeManagement/pubNotice/auditSuccessDialog' // 审核通过
import authenticationDialog from '@component/common/authenticationDialog' // 公共身份验证框
import { saveScrollMixins } from '@/mixins/saveScroll'
import { getSearchList } from '@/api/noticeManagement/pubNotice'
export default {
  name: 'pubNoticeList',
  msg: '发布审核',
  mixins: [saveScrollMixins],
  components: {
    topSearch,
    auditFailDialog,
    auditSuccessDialog,
    detailDialog,
    authenticationDialog
  },
  data() {
    return {
      loading: false,
      total: 0,
      formInline: {
        timeType: 'CREATEDTIME',
        createTime: [],
        searchContent: '',
        oneAuditingState: '', // 一审状态,默认全部
        twoAuditingState: '', // 二审状态,默认全部
        touchType: '', // 触达通道,默认全部
        startTime: '', // 开始时间
        endTime: '' // 结束时间
      },
      searchParams: {
        pageNum: 1, // 当前页数
        pageSize: 10 // 页面显示条数
      },
      // 表格数据
      tableData: [],
      // 审核不通过对话框
      auditFailDialogData: {
        isShow: false, // 控制不通过对话框显示
        noticeId: ''
      },
      // 审核通过对话框
      auditSuccessDialogData: {
        isShow: false,
        noticeId: '',
        editFlag: false // 是否是编辑
      },
      // 详情弹窗
      detailDialogData: {
        isShow: false,
        params: ''
      },
      // 身份验证弹窗
      authDialogData: {
        isShow: true,
        params: ''
      }
    }
  },
  activated() {
    this.toTableScrollHeight()
  },
  mounted() {
    this.searchList()
    this.$nextTick(() => {
      setTimeout(() => {
        this.setTableScrollHeight()
      }, 1000)
    })
  },
  methods: {
    /* 获取列表*/
    searchList() {
      this.loading = true
      let params = { ...this.formInline, ...this.searchParams }
      delete params.createTime
      getSearchList(
        params,
        (response) => {
          this.tableData = response.rows
          this.total = response.total
          this.loading = false
        },
        (response) => {
          this.loading = false
          this.$message({
            message: response.message,
            type: 'warning'
          })
        }
      )
    },
    // 点击未通过 显示原因
    noticeMessage(res) {
      this.$alert(`${res}`, '系统提示', {
        confirmButtonText: '确定'
      }).catch(() => {})
    },
    // 分页当前页改变
    changePage(page) {
      this.searchParams.pageNum = page
      this.searchList()
    },
    // 审核不通过
    auditFail(noticeId) {
      this.auditFailDialogData.isShow = true
      this.auditFailDialogData.noticeId = noticeId
    },
    // 审核通过
    auditSuccess(row) {
      this.auditSuccessDialogData.params = row
      this.auditSuccessDialogData.noticeId = row.id
      this.auditSuccessDialogData.isShow = true
      this.auditSuccessDialogData.editFlag = false
    },
    // 编辑通知
    editNotice(row) {
      this.auditSuccessDialogData.noticeId = row.id
      this.auditSuccessDialogData.params = row
      this.auditSuccessDialogData.isShow = true
      this.auditSuccessDialogData.editFlag = true
    },
    // 查看详情
    openDetail(noticeId) {
      this.detailDialogData.isShow = true
      this.detailDialogData.params = noticeId
    },
    // 搜索
    toSearch() {
      this.searchParams.pageNum = 1
      this.searchList()
    },
    // 刷新列表
    refresh() {
      this.toSearch()
    }
  }
}
</script>
<style lang="less">
#pubNoticeList {
  .hand {
    cursor: pointer;
  }
}
</style>
